<template>
  <el-container>
    <el-card>
      <el-container class="home_aside">
        <!-- 侧边栏 -->
        <el-aside width="200px" class="" style="height: auto;">
          <el-menu default-active="2" :router="true" class="el-menu-vertical-demo">
            <el-menu-item index="/user_info">个人信息</el-menu-item>
            <el-menu-item index="/renewList">充值记录</el-menu-item>
            <el-menu-item index="/myPrivateEducation">我的私教课</el-menu-item>
            <el-menu-item index="/loos">物品遗失</el-menu-item>
            <el-menu-item index="/aiChat">客服</el-menu-item>
          </el-menu>
        </el-aside>
        <el-container>
          <!-- 主体 -->
          <el-main>
            <router-view :key="$route.fullpath"></router-view>
          </el-main>
        </el-container>
      </el-container>
    </el-card>

    <el-footer class="home_footer">
      <div class="home_footer_copyright"><span>坚持自律</span></div>
    </el-footer>
  </el-container>
</template>

<script>

export default {
  methods: {
    loginOut () {
      this.$store.dispatch('user/loginOut').then(res => {
        console.log(res);
        if (res) {
          {
            this.$message.warning("退出登录成功！")
            this.$router.push("/login");
          }
        }
      });

    },
  }
}
</script>
<style scoped>
.home_header {
  height: 26px;
  background: #fff;
}

.home_header_logo {
  text-align: center;
  font-size: 20px;
  color: black;
}

.home_header_logo span {
  margin-left: 20px;
}

.home_header_logout {
  float: right;
  width: 5rem;
}

.card {
  color: #fff;
  background: radial-gradient(circle at 60% 90%,
      rgba(46, 103, 161, 1),
      transparent 60%),
    radial-gradient(circle at 20px 20px,
      rgba(46, 103, 161, 0.8),
      transparent 25%),
    #182336;
}

.home_aside {
  height: 80vh;
  background: #fff;
}

.home_aside_menu {
  height: 75vh;
}

::v-deep .el-menu {
  border: 0px;
}

.home_footer {
  display: flex;
  height: 10vh !important;
  background: #fff;
  color: #888;
}

.home_footer_copyright {
  margin: auto;
}
</style>
